<template>
	<view class="my">
		<Header></Header>
		<view class="content">
			<view class="list one">
				<view class="item" @click="router(`/pages/my/real?is=${real_status}`)">
					<image :src="`${baseImageUrl}/my/1.png`"></image>
				</view>
				<!-- <view class="item" @click="router()">
					<image :src="`${baseImageUrl}/my/2.png`"></image>
				</view>
				<view class="item accountant" @click="router()">
					<image :src="`${baseImageUrl}/my/3.png`"></image>
				</view> -->
				<view class="item" @click="router('/pages/my/wallet')">
					<image :src="`${baseImageUrl}/my/2.png`"></image>
				</view>
				<view class="item accountant" @click="router('/pages/my/log')">
					<image :src="`${baseImageUrl}/my/3.png`"></image>
				</view>
			</view>
			<view class="list two">
				<view class="item" @click="router('/pages/my/change?type=balance')">
					<image :src="`${baseImageUrl}/my/4.png`"></image>
				</view>
				<view class="item" @click="router('/pages/my/change?type=pay_balance')">
					<image :src="`${baseImageUrl}/my/5.png`"></image>
				</view>
				<view class="item" @click="router('/pages/setting/article')">
					<image :src="`${baseImageUrl}/my/6.png`"></image>
				</view>
			</view>
			<view class="btn_view">
				<view @click="popup_show=true">注销账号</view>
				<view @click="signout">退出登录</view>
			</view>
		</view>
		<Footer active="3"></Footer>

		<u-popup :show="popup_show" bgColor="transparent" mode="center" @close="popup_show=false">
			<LogOff @close="popup_show=false" />
		</u-popup>
	</view>
</template>

<script>
	import {
		userInfo
	} from '@/request/api.js';
	import Header from "@/components/tabbar/Header.vue";
	import Footer from "@/components/tabbar/Footer.vue";
	import LogOff from "@/components/my/LogOff.vue";
	export default {
		components: {
			Header,
			Footer,
			LogOff
		},
		data() {
			return {
				real_status: 0,
				popup_show: false
			}
		},
		async onShow() {
			let {
				user,
				disaster
			} = await userInfo();
			this.$store.commit('changeInfo', user);
			this.$store.commit('changeDisaster', disaster);
			this.real_status = user.real_status;

			let role_id = user.role_id;

			if (role_id == 0) {
				this.$u.toast("请先选择角色");
				setTimeout(() => {
					this.router("/pages/login/role");
				}, 1000);
			}
		},
		methods: {
			async signout() {
				this.$u.toast("已退出登录");
				this.$store.commit('outLogin');
				setTimeout(() => {
					uni.redirectTo({
						url: '/pages/login/login'
					})
				}, 1000);
			}
		}
	}
</script>
<style scoped lang="scss">
	.my {
		.content {
			width: 100%;
			height: 1560rpx;
			padding-top: 440rpx;
			box-sizing: border-box;
			background: url(#{$baseImageUrl}/my/bg.png) no-repeat;
			background-size: 100% 100%;

			.list {
				display: flex;
				justify-content: space-between;

				&.one {
					padding: 0 38rpx 0 56rpx;
					box-sizing: border-box;
				}

				&.two {
					padding: 235rpx 14rpx 0 70rpx;
					box-sizing: border-box;
				}

				.item {
					width: 200rpx;
					height: 200rpx;

					&.accountant {
						padding-top: 50rpx;
					}

					image {
						width: 100%;
						height: 100%;
					}
				}
			}

			.btn_view {
				margin-top: 192rpx;
				display: flex;
				justify-content: center;

				view {
					width: 160rpx;
					height: 44rpx;
					line-height: 44rpx;
					text-align: center;
					color: #FFFFFF;
					font-size: 30rpx;
					font-weight: 400;
					font-family: SimSun;
					margin: 0 66rpx;
					background: url(#{$baseImageUrl}/my/label.png) no-repeat;
					background-size: 100% 100%;
				}
			}
		}
	}
</style>